<template>
  <div class="app-container">

    <!--  第一部分-->
    <el-row :gutter="2" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log" style="height: 70px">
          <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="身份证号">
              <el-input v-model="formInline.user" placeholder="请输入身份证号" style="width: 500px"></el-input>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" plain icon="el-icon-search" @click="handleQuery">加载身份证号</el-button>
              <el-button type="warning" plain icon="el-icon-zoom-in" @click="addPatient">添加患者信息</el-button>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
    </el-row>

    <!--  第二部分-->
    <el-row :gutter="20" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log">
          <el-form :inline="true" :model="formInline" class="demo-form-inline" :rules="rules">

            <!--                                            v-show="false"隐藏            -->
            <el-form-item label="身份证号" v-show="false">
              <el-input v-model="formInline.patientId" placeholder="患者身份证号码" hidden></el-input>
            </el-form-item>

            <el-form-item label="身份证号" prop="card">
              <el-input v-model="formInline.patientCard" placeholder="患者身份证号码"
                        :aria-valuetext="formInline.patientCard"></el-input>
            </el-form-item>

            <el-form-item label="患者姓名" prop="name">
              <el-input v-model="formInline.patientName" placeholder="患者姓名"></el-input>
            </el-form-item>
            <el-form-item label="患者电话" prop="phone">
              <el-input v-model="formInline.patientPhone" placeholder="患者电话" value="postList.phone"></el-input>
            </el-form-item>

            <!--            <el-form-item label="性别" prop="sex">
                          <el-radio-group v-model="formInline.patientSex">
                            <el-radio label="男" ></el-radio>
                            <el-radio label="女"></el-radio>
                          </el-radio-group>
                        </el-form-item>-->

            <el-form-item label="性别">
              <el-radio-group v-model="formInline.patientSex">
                <el-radio
                  v-for="dict in dict.type.sys_user_sex"
                  :key="dict.value"
                  :label="dict.value"
                >{{ dict.label }}
                </el-radio>
              </el-radio-group>
            </el-form-item>

            <el-form-item label="出生日期">
              <el-date-picker
                v-model="formInline.patientBirth"
                type="date"
                placeholder="选择日期"
                style="width: 150px">
              </el-date-picker>
            </el-form-item>

            <el-form-item label="患者年龄">
              <el-input v-model="formInline.patientAge" placeholder="患者年龄"></el-input>
            </el-form-item>

            <el-form-item label="地址信息">
              <el-input v-model="formInline.patientAddress" placeholder="地址信息" style="width: 600px"></el-input>
            </el-form-item>
          </el-form>
        </el-card>
      </el-col>
    </el-row>

    <!--  第三部分-->
    <el-row :gutter="20" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log" style="height: 70px">

          <!--          <el-row :gutter="15">
                      <el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
                        <el-col :span="12">
                          <el-form-item label="检查项目" prop="field101">
                            <el-radio-group v-model="tabPosition" style="margin-bottom: 30px;">
                              <span v-for="n in ns">
                                <el-radio-button :label="n" >{{n}}</el-radio-button>
                                </span>
                            </el-radio-group>
                          </el-form-item>
                        </el-col>
                      </el-form>
                    </el-row>-->

          <el-radio-group v-model="queryParams.regis">
            <el-radio-button v-for="type in dict.type.xl_regis_type" :key="type.value" :label="type.label"
                             :value="type.value" @click.native="queryFee(type.value)"></el-radio-button>
          </el-radio-group>

          <span style="padding-left: 450px">
          挂号费:¥{{ price }}
          <el-button type="danger" plain icon="el-icon-zoom-in" @click="aa">挂号收费</el-button>
        </span>

        </el-card>
      </el-col>
    </el-row>


    <!--  第四部分-->
    <el-row :gutter="20" style="padding-left: 20px;padding-right: 20px">
      <el-col :xs="24" :sm="24" :md="12" :lg="24" style="padding-top: 20px">
        <el-card class="update-log">
          <el-form :inline="true" :model="registerQuery" class="demo-form-inline">

              <el-form-item label="所属部门" prop="deptName">
                <el-select
                  v-model="registerQuery.deptName"
                  placeholder="操作类型"
                  clearable
                  size="small"
                  style="width: 240px"
                >
                  <el-option
                    v-for="dict in dept"
                    :key="dict.key"
                    :label="dict.label"
                    :value="dict.deptName"
                  />
                </el-select>
              </el-form-item>

            <el-form-item label="挂号类型" prop="registerName">
              <el-select
                v-model="registerQuery.registerName"
                placeholder="挂号类型"
                clearable
                size="small"
                style="width: 240px"
              >
                <el-option
                  v-for="dict in registraLists"
                  :key="dict.key"
                  :label="dict.label"
                  :value="dict.registerName"
                />
              </el-select>
            </el-form-item>

            <el-form-item label="挂号时段" prop="regisTime">
              <el-select
                v-model="registerQuery.regisTime"
                placeholder="操作类型"
                clearable
                size="small"
                style="width: 240px"
              >
                <el-option label="上午" value="上午"></el-option>
                <el-option label="下午" value="下午"></el-option>
                <el-option label="晚上" value="晚上"></el-option>
              </el-select>
            </el-form-item>


            <el-form-item label="挂号时间" prop="patientTime">
              <el-date-picker
                v-model="registerQuery.patientTime"
                format="yyyy-MM-dd"
                value-format="yyyy-MM-dd"
                style="width: 150px"
                placeholder="选择日期"
                clearable></el-date-picker>
            </el-form-item>

            <el-form-item>
              <el-button type="primary" @click="onSubmit()">查询</el-button>
            </el-form-item>
          </el-form>


          <!--    科室和挂号      -->
          <el-table v-loading="loading" :data="patientList">
            <el-table-column label="科室ID" align="center" prop="deptId" :show-overflow-tooltip="true"/>
            <el-table-column label="科室名称" align="center" prop="sysDept.deptName" :show-overflow-tooltip="true"/>
            <el-table-column label="当前号数" align="center" prop="beforeCode" :show-overflow-tooltip="true"/>

            <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
              <template slot-scope="scope">
                <el-button type="success" @click="choice_confirm(scope.row)" plain>选择</el-button>
              </template>
            </el-table-column>
          </el-table>


          <pagination
            v-show="total>0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
          />


        </el-card>
      </el-col>
    </el-row>


  </div>
</template>

<script>
import {listdept, findPatient, updatePeople, queryRegis, addDept,addPatient} from "@/api/doctor/patient";
import {listDepts, listRegistr} from "@/api/doctor/regisList";

export default {
  name: "Patient",
  dicts: ['sys_user_sex', 'xl_regis_type'],
  data() {
    return {
      // 遮罩层
      loading: true,
      // 选中数组
      ids: [],
      price: 0.0,
      // 非单个禁用
      single: true,
      // 非多个禁用
      multiple: true,
      //显示检查项目
      /* tabPosition: '',
       ns:['a','1','22','222'],*/
      // 显示搜索条件
      showSearch: true,

      //查询参数
      registerQuery: {
        pageNum: 1,
        pageSize: 10,
        deptName:undefined,
        registerName: undefined,
        regisTime:undefined,
        patientTime:undefined,
      },//挂号单查询参数

      // 总条数
      total: 0,
      patientList: [],
      // 弹出层标题
      title: "",
      // 是否显示弹出层
      open: false,
      // 查询参数
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        deptId: undefined,
        beforeCode: undefined,
        regis: undefined,
        sysDept: undefined,
      },
      // 表单参数
      form: {},
      // 表单校验
      rules: {
        card: [
          {required: true, message: "身份证号不能为空", trigger: "focus"}
        ],
        name: [
          {required: true, message: "患者姓名不能为空", trigger: "focus"}
        ],
        phone: [
          {required: true, message: "电话号码不能为空", trigger: "focus"}
        ]
      },
      //查询挂号名称
      registraLists: [],
      //查询科室下拉框内容
      dept: [],
      formInline: {
        user: '',
        region: '',
        patientId: 0,
        patientCard: '',
        patientName: '',
        patientPhone: '',
        patientSex: '',
        patientBirth: '',
        patientAge: undefined,
        patientAddress: '',
      },
      regis: 0,
    };
  },
  created() {
    this.getList();
    this.getDept();
    this.getRegis();
  },
  methods: {

    aa(){
      this.$router.push({path:'/doctor/regisList'})
    },

    addPatient(){
      this.loading = true;
      console.log(this.formInline);
      addPatient(this.formInline).then(res => {
          this.open1()
          this.loading = false;
          this.formInline.patientId = res
      })
    },

    onSubmit() {
      this.loading = true;
      console.log(this.registerQuery)
      listdept(this.registerQuery).then(response => {
        this.patientList = response.rows;
        console.log(this.patientList)
        this.total = response.total;
        this.loading = false;
      });
    },

    getList() {
      this.loading = true;
      listdept(this.queryParams).then(response => {
        this.patientList = response.rows;
        console.log(this.patientList)
        this.total = response.total;
        this.loading = false;
      });
    },


    //获取全部的部门
    getDept(){
      listDepts().then(res =>{
        console.log(res)
        this.dept = res
      });
    },
    //获取所有挂号类型
    getRegis(){
      listRegistr().then(res =>{
        console.log(res)
        this.registraLists = res
      });
    },

    //添加患者信息
    /*addPatient() {

      addPost(this.postList).then(res=>{
        // console.log(res);

        if (res.msg==='操作成功，请选择挂号类型'){
          this.patient_id=res.data.id;
          this.open1();
        }

      })
    },*/

    open1() {
      this.$message({
        message: '信息加载成功，请选择挂号类型',
        type: 'success'
      });
    },
    handleQuery() {
      this.loading = true;
      findPatient(this.formInline.user).then(res => {
        this.formInline = res.data;
        //this.formInline.patientCard=res.data.id;
        this.open1()
        this.loading = false;
      })

    },

    /*选择提示*/
    choice_confirm(index) {
      console.log(index)
      this.$confirm('是否选择挂该科室?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        /*this.price=index.regis.regisFee;*/
        this.add(index)
        //this.$router.go(0)
        this.$message({
          type: 'success',
          message: '选择成功!',
        });
        this.getList()
        /*updatePeople(index)*/
        /*this.reload();*/
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消'
        });
      });
    },

    /*添加患者科室*/
    add(index) {
      addDept(this.formInline.patientId,index.deptId,index.beforeCode)
    },

    /*修改当前人数*/
    update(index){
      updatePeople(index.beforeCode,index.deptName)
    },

    /*查询挂号费*/
    queryFee(regisId) {
      console.log(regisId)
      this.regis = regisId
      console.log(this.formInline.patientId)
      queryRegis(regisId,this.formInline.patientId).then(res => {
        // queryParams.regis = res.data()
        //console.log(res.data)
        console.log(res.data.registerPrice)
        this.price = res.data.registerPrice
      })
    }


  }
};
</script>
